
import React from 'react';

import {createBottomTabNavigator} from 'react-navigation';

import Home from '../Modules/Main/Home.js'
import Searcher from '../Modules/Main/Searcher.js'
import VipCenter from '../Modules/VipCenter/VipCenter.js'
import ShopCart from '../Modules/ShopCart/ShopCart.js'
import Mine from '../Modules/Mine/Mine.js'
import Svg from '../Components/Svg';
import {BaseStyle} from "../Style/BaseStyle";


export const BottomNavigator = createBottomTabNavigator(
    {
        Home: {
            screen: Home,
            navigationOptions: {

                title: "首页",
                tabBarIcon: ({ focused, horizontal, tintColor }) => {
                    return <Svg icon="home" size={20} color={tintColor}/>
                }
            }
        },
        searcher: {
            screen: Searcher,
            navigationOptions: {
                title: "搜索",
                tabBarIcon: ({ focused, horizontal, tintColor }) => {
                    return <Svg icon="searcher" size={20} color={tintColor}/>
                }
            }
        },
        vip: {
            screen: VipCenter,
            navigationOptions: {
                title: "VIP",
                tabBarIcon: ({ focused, horizontal, tintColor }) => {
                    return <Svg icon="VIP" size={20} color={tintColor}/>
                }
            }
        },
        cart: {
            screen: ShopCart,
            navigationOptions: {
                title: "购物车",
                tabBarIcon: ({ focused, horizontal, tintColor }) => {
                    return <Svg icon="cart" size={20} color={tintColor}/>
                }
            }
        },
        mine: {
            screen: Mine,
            navigationOptions: {
                title: "我的",
                tabBarIcon: ({ focused, horizontal, tintColor }) => {
                    return <Svg icon="mine" size={20} color={tintColor}/>
                }
            }
        },
    },
    {
        tabBarPosition: 'bottom',
        tabBarOptions: {
            activeTintColor: '#2EBA0E'
        },
        initialRouteName:'Home'
    },
    {
        tabBarOptions: {
            activeTintColor: BaseStyle.titleColor.backgroundColor,
            showIcon: true,
            pressOpacity: 0.8
        }
    }
)


